<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<script>
		document.createElement("mydiv")
	</script>
	<style>
		#d1{
			color:red;
		}
		#d2>div>div{
			background-color: orange;
		}
	</style>
</head>
<body>
	<mydiv id="d1">这里是自定义标签</mydiv>
	<div id="d2">
		<div>
			<div class="d2"></div>
			<!-- 使用h5新的语义化标签 区分传统div -->
			<section>这里是section的内容</section>
		</div>
		<div>
			<div class="d2"></div>
		</div>
	</div>
	<!-- h5新增的标签 -->
	<article>
		这里是文章主题
		<aside>页面之外的内容</aside>
		<bdi>可从新定义文本方向</bdi>
		<details>
			<summary>元素标题1</summary>
			<summary>元素标题2</summary>
			<summary>元素标题3</summary>
		</details>
		<dialog>定义对话框或窗体</dialog>
		<figcaption>
			<figure>
				图示、图片、图标
			</figure>
		</figcaption>
		<footer>页脚</footer>
		<header>页眉</header>
		<main>文章重点内容</main>
		<mark>这里是标记文字</mark>
		<meter value="1">度量</meter>
		<nav>导航</nav>
		<progress value="6" min="0" max="10">进度条</progress>
		<section>文章中的章节</section>
		<time>2023-3-29</time>
		<address>河南郑州市</address>
	</article>
	<!-- h5新增的表单输入内容 和H5的新属性-->
	<form action="" method="post" enctype="multipart/form-data">
		<!-- <input type="color" name="" id="">
		<input type="datetime-local" name="" id="">
		<input type="file" name="" id="">
		<input type="range" name="" id="" min="0" max="100" value="66">
		<input type="search" name="" id="">
		<input type="email" name="" id="">
		<input type="url" name="" id=""> -->
		<input type="number" name="" id="" min="-100" max="100" step="3">
		<input type="password" name="" id="" autocomplete="new-password">
		<input type="text" value="" autofocus required>
		<input type="text" value="" placeholder="请输入账号6-8为数字或英文" pattern="[0-9a-zA-Z]{6,8}">
		<input type="tel" value=13712341234>
		<input type="submit" id="" name="提交" />
		<input type="reset" value="重置" disabled>
	</form>
</body>
</html>